<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <title>Think Admin 后台管理系统</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="format-detection" content="telephone=no">
    <!--CSS引用-->
    <link rel="stylesheet" href="__JS__/Mdui/css/mdui.min.css">
    <link rel="stylesheet" href="__JS__/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="__CSS__/font-awesome.min.css">
    <link rel="stylesheet" href="__CSS__/custom.css">
    <link rel="stylesheet" href="__CSS__/admin.css">
    <script src="__JS__/jquery.min.js"></script>
    <script src="__JS__/Mdui/js/iPages-1.0.0.min.js"></script>
    <script src="__JS__/socket/socket.js"></script>
    <!--[if lt IE 9]>
    <script src="__CSS__/html5shiv.min.js"></script>
    <script src="__CSS__/respond.min.js"></script>
    <![endif]-->

    <style>
        #statistics .count {
            width: calc(100% / 4 - 30px);
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 14px;
            text-align: center;
            height: 80px;
            margin: 15px;
            background-color: #fff;
            border-radius: 15px;
        }

        #statistics .count .title {
            font-weight: bold;
            font-size: 24px;
        }

        #statistics .count .num {
            font-weight: bold;
            font-size: 16px;
        }
    </style>
</head>

<body class="gray-bg">
    <div class="layui-layout layui-layout-admin">
        <!--头部-->
        <div class="layui-header header">
            <a href="">
                <img class="logo" src="__STATIC__/images/admin_logo.png" alt="">
            </a>
            <ul class="layui-nav" style="position: absolute;top: 10px;right: 20px;background: none;">
                <li class="layui-nav-item">
                    <a href="{:url('/admin/kefu/index')}" target="_self">客服管理</a>
                </li>
                <li class="layui-nav-item">
                    <a href="{:url('/admin/admin_user/index')}" target="_self">用户管理</a>
                </li>
                <li class="layui-nav-item">
                    <a href="{:url('/')}" target="_blank">前台首页</a>
                </li>
                <li class="layui-nav-item">
                    <a href="" data-url="{:url('admin/system/clear')}" id="clear-cache">清除缓存</a>
                </li>
                <li class="layui-nav-item">
                    <a href="javascript:;">{:session('admin_name')}</a>
                    <dl class="layui-nav-child">
                        <!-- 二级菜单 -->
                        <dd>
                            <a href="{:url('admin/change_password/index')}">修改密码</a>
                        </dd>
                        <dd>
                            <a href="{:url('admin/login/logout')}">退出登录</a>
                        </dd>
                    </dl>
                </li>
            </ul>
        </div>
        <div id="cusTable" class="layui-body" style="left:0;">
            <div id="statistics" style="width: 100%;background-color:#6c6c6c;font-size: 0;display: flex;flex-wrap: wrap;">
                <div class="count">
                    <div>
                        <div class="title">授权公众号</div>
                        <div class="num" id="publicCount">1111</div>
                    </div>

                </div>
                <div class="count">
                    <div>
                        <div class="title">有效客服数</div>
                        <div class="num" id="validCust">1111</div>
                    </div>
                </div>
                <div class="count">
                    <div>
                        <div class="title">在线客服数</div>
                        <div class="num" id="onlineCust">11111</div>
                    </div>
                </div>
                <div class="count">
                    <div>
                        <div class="title">总粉丝数</div>
                        <div class="num" id="fanscount">1111</div>
                    </div>
                </div>
            </div>

            <!--tab标签-->
            <div class="layui-tab layui-tab-brief">
                <ul class="layui-tab-title">
                    <li class="layui-this">授权管理</li>
                </ul>
                <div class="layui-tab-content">
                    <div class="layui-tab-item layui-show">
                        <table class="layui-table">
                            <thead>
                                <tr>
                                    <th style="width: 30px;">ID</th>
                                    <th>操作账号</th>
                                    <th>名称</th>
                                    <th>注册主体</th>
                                    <th>有效账号</th>
                                    <th>当天关注</th>
                                    <th>当天对接</th>
                                    <th>当天消息</th>
                                    <th>操作</th>
                                </tr>
                            </thead>
                            <tbody>
                                {foreach name="wechat_list" item="vo"}
                                <tr>
                                    <td>{$vo.id}</td>
                                    <td>{$vo.admin_name}</td>
                                    <td>{$vo.wxname}</td>
                                    <td>{$vo.principal_name}</td>
                                    <td><span id="valid_count{$vo.id}">{$vo.current_csuser_count.valid_count ?? '0'}</span>/<span id="online_count{$vo.id}">{$vo.current_csuser_count.online_count ?? '0'}</span></td>
                                    <td id="current_subscribe_count{$vo.id}">{$vo.current_subscribe_count}</td>
                                    <td id="current_butt_count{$vo.id}">{$vo.current_butt_count}</td>
                                    <td id="current_msg_count{$vo.id}">{$vo.current_msg_count}</td>
                                    <td>
                                        <a href="{:url('admin/index/index',['id'=>$vo['id']])}" class="layui-btn layui-btn-normal layui-btn-mini">详情</a>
                                        {if condition="session('admin_id') eq 1"}
                                        <a href="javascript:;" onclick="authorforuser({$vo.id});" class="layui-btn layui-btn-normal layui-btn-mini">授权管理</a>
                                        {/if}
                                    </td>
                                </tr>
                                {/foreach}
                            </tbody>
                        </table>
                    </div>
                </div>
                <div style="text-align: center;">
                    <a href="{:url('admin/index/author')}" class="layui-btn layui-btn-primary layui-btn-mini">点击扫码授权</a>
                </div>
            </div>
        </div>
        <!--底部-->
        <div class="layui-footer footer" style="left:0;">
            <div class="layui-main">
                <p>2016 &copy;
                    <a href="https://github.com/xiayulei/think_admin" target="_blank">Think Admin</a>
                </p>
            </div>
        </div>
    </div>

    <!--JS引用-->

    <script src="__JS__/layui/lay/dest/layui.all.js"></script>
    <script src="__JS__/admin.js"></script>
    <script src="__JS__/Vue/vue.js"></script>
    <script src="__JS__/Mdui/js/mdui.min.js"></script>
    <script>
        $(document).ready(function () {
            //连接成功时触发
            ws.onopen = function(){
                // 登录
                var login_data = '{"type":"init","data":{"id":"{$Think.session.admin_id}","username":"{$Think.session.admin_name}"}}';
                ws.send(login_data);
                console.log('连接成功');
            };

            ws.onmessage = function (evt) {
                var data = JSON.parse(evt.data);
                var message_type = data.message_type;
                console.log(data);
                switch (message_type) {
                    case 'init':
                        console.log('用户：'+data.data.id+' 登录成功');
                        break;
                    case 'current_csuser_count':
                        $('#valid_count' + data.data.id).text(data.data.current_csuser_count.valid_count);
                        $('#online_count' + data.data.id).text(data.data.current_csuser_count.online_count);
                        break;
                    case 'current_subscribe_count':
                        $('#current_subscribe_count' + data.data.id).text(data.data.current_subscribe_count);
                        break;
                    case 'current_butt_count':
                        $('#current_butt_count' + data.data.id).text(data.data.current_butt_count);
                        break;
                    case 'current_msg_count':
                        $('#current_msg_count' + data.data.id).text(data.data.current_msg_count);
                        break;
                    default:
                        break;
                }
            }
        });

        function authorforuser(id) {
            layui.use('layer', function () {
                var layer = layui.layer;
                layer.open({
                    type: 2,
                    content: '/admin/publicnum/users/wechat_id/' + id,
                    area: ['500px'],
                    cancel: function (index, layero) {
                        location.reload();
                        return false;
                    }
                });
            });
        }


    </script>
</body>

</html>